<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Js函数</title>
</head>
<body>
    <button onclick="alert('警告框')">弹出警告框</button>
    <button onclick="confirm('您确认要删除吗？')">弹出确认框</button>
    <button onclick="prompt('请输入会员卡号：')">弹出提示输入框</button>
    <script>
        //1.Js通过function关键字来定义函数
        function f1(){
            console.log('f1函数');
        }
        f1();
        //2.带参的函数
        function f2(name){
            console.log('f2函数'+name);
        }
        f2('张三');
        f2(666);
        f2(false);

        //3.形参与实参个数问题
        function f3(x,y){
            console.log(x+y);
        }
        f3(1,2);//3
        f3(1);//1+undefined=NaN
        f3(1,2,3);//1+2=5

        //4.arguments用来保存调用函数时传入的参数，可以看到参数的个数与具体的值
        function f4(){
            console.log(arguments);
        }
        f4(1);//Arguments [1, ...]
        f4(1,2);// Arguments(2) [1, 2, ...]
        f4(1,2,3);//Arguments(3) [1, 2, 3, ...]

        //5.函数的返回值
        function f5(a,b){
          return a+b;
        }
        var res = f5(1,2);
        console.log(res);//3 将return中的结果保存在res变量中，再打印出来
        console.log(f5(1,2));//3 直接打印函数的返回值


        //第二种函数声明的方式
        //将函数整体交给一个变量来保存，调用函数时直接使用变量名
        var f6 = function(){
            console.log('f6函数');
        }
        console.log(f6);//[Function: f6]
        console.log(typeof f6);
        f6();

        //第三种函数声明方式 箭头函数
        const f7 = (n) => {
            console.log('箭头函数'+n);
        }
        f7('你好');
    </script>

</body>
</html>














